<template>
  <div class="main-container-app">
    <el-row class="form-contain">
      <re-coll-form @handleQueryParkInfo="handleQueryReColl"

                                                                    @openParkDialog="openParkDialog"
                                                                    @changeModel="changeModel"
                                                                    :parkMsg="parkMsg"></re-coll-form>
    </el-row>
    <div class="table-contain">
      <data-re-table :searchList="dataReRes"
                     :listLoadingParkInfo="loading"
                     :showModel="queryData.model"
                     @handleSizeChangeParkInfo="handleSizeChangeDataRe"
                     @handleCurrentChangeParkInfo="handleCurrentChangeDataRe"></data-re-table>
    </div>
    <park-msg-dialog :parkVisible.sync="parkVisible" @parkMsg="getParkMsg"></park-msg-dialog>
  </div>

</template>

<script>
  import DataReTable from './parkInfoSearch/parkInfoSearchTable';
  import ReCollForm from './parkInfoSearch/parkInfoSearchForm';
  import { queryParkingRecord } from '../../api/parkDataSearch/parkInfoDataSearch';
  import ParkMsgDialog from './parkInfoSearch/parkMsgDialog';

  export default {
    components: {
      ParkMsgDialog,
      ReCollForm,
      DataReTable
    },
    data() {
      return {
        parksList: '',
        parkMsg: '',
        parkVisible: false,
        dataReRes: null,
        loading: false,
        queryData: {
          plateNo: '',
          model: ''
        },
        listQuery: {
          page: 1,
          limit: 20
        }
      };
    },
    mounted() {
      //  this.switchMethod()
    },
    methods: {
      switchMethod() {
        this.queryParkingRecord()
      },
      changeModel(val) {
        this.queryData = val
        this.switchMethod()
      },
      handleQueryReColl(val) {
        this.queryData = val
        this.listQuery.page = 1
        this.listQuery.limit = 20
        this.switchMethod()
      },
      handleCurrentChangeDataRe(val) {
        this.listQuery.page = val
        this.switchMethod()
      },
      handleSizeChangeDataRe(val) {
        this.listQuery.limit = val
        this.listQuery.page = 1
        this.switchMethod()
      },
      /** getDataListDataRe() {
        this.loading = true
        selectParkingBizs(this.listQuery, this.queryData).then(res => {
          const array = res.list
          for (const index in array) {
            array[index].time = moment(array[index].parkIntime).format('YYYY-MM-DD HH:mm:ss')
            array[index].parkinImageurl = array[index].parkinImageurl
          }
          this.dataReRes = res
          this.dataReRes.list = array
          this.loading = false
        },
        () => {
          this.loading = false
        })
      },*/
      queryParkingRecord() {
        this.loading = true;
        console.log(this.loading);
        queryParkingRecord(this.listQuery, this.queryData).then(res => {
          const array = res.list;
          this.dataReRes = res;
          this.dataReRes.list = array;
          this.loading = false;
        }, () => {
          this.loading = false;
        });
      },
      /* 车场弹出框*/
      openParkDialog(val) {
        this.parkVisible = val;
      },
      /* 获取车场信息*/
      getParkMsg(val) {
        this.parkMsg = val;
      }
    }
  };
</script>
